<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <% String contextPath = request.getContextPath(); 
    request.setAttribute("contextPath", contextPath);%>
    <%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">

<head>

    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">

    <title>添加客服</title>

    <!-- Bootstrap Core CSS -->
    <link href="${contextPath}/css/bootstrap.min.css" rel="stylesheet">

    <!-- MetisMenu CSS -->
    <link href="${contextPath}/css/metisMenu.min.css" rel="stylesheet">

    <!-- Custom CSS -->
    <link href="${contextPath}/css/sb-admin-2.css" rel="stylesheet">

    <!-- Custom Fonts -->
    <link href="${contextPath}/css/font-awesome.min.css" rel="stylesheet" type="text/css">

    <!--common Css-->
    <link href="${contextPath}/css/common.css" rel="stylesheet">
    <link href="${contextPath}/iconfont/iconfont.css" rel="stylesheet">
</head>

<body>

<div id="wrapper">

    <!-- Navigation -->
    <%@include file="nav.jsp"%>

    <div id="page-wrapper">
        <div class="row">
            <div class="col-lg-12">
                <h3 class="page-header">添加客服</h3>
            </div>
            <!-- /.col-lg-12 -->
        </div>
        <!-- /.row -->
        <div class="row">
            <div class="col-lg-12">
                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="row">
                            <div class="col-lg-6">
                                <form role="form" class="form-horizontal" method="post" enctype="multipart/form-data" action="">
                                    <div class="form-group">
                                        <label for="account" class="col-sm-2 control-label">账户</label>
                                        <div class="col-md-8">
                                            <input type="text" class="form-control" id="account1" name="account1" placeholder="账号只能输入英文和数字3到14位">     
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="serverName" class="col-sm-2 control-label">姓名</label>
                                        <div class="col-md-8">
                                            <input type="text" class="form-control" id="serverName" name=serverName placeholder="请输入不超过7个汉字或1-14个英文的姓名">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="nickName" class="col-sm-2 control-label">昵称</label>
                                        <div class="col-md-8">
                                            <input type="text" class="form-control" id="nickName" name="nickName" placeholder="请输入不超过7个汉字或1-14个英文的昵称">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="phoneNum" class="col-sm-2 control-label">手机</label>
                                        <div class="col-md-8">
                                            <input type="text" class="form-control" id="phoneNum" name="phoneNum" placeholder="客服手机号只能输入11位数字">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="password" class="col-sm-2 control-label">初始密码</label>
                                        <div class="col-md-8">
                                            <input type="password" class="form-control" id="password1" name="password1" placeholder="密码只能输入10到20位数字和字母">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="rePassword" class="col-sm-2 control-label">确认密码</label>
                                        <div class="col-lg-8">
                                            <input type="password" class="form-control" id="rePassword" name="rePassword" placeholder="请再次确认密码">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="serverType" class="col-sm-2 control-label">选择角色</label>
                                        <div class="col-lg-8">
                                            <select class="form-control" id="serverType" name="serverType">
                                            	<option value="2">普通客服</option>
                                                <option value="1">管理员</option>
                                               	
                                            </select>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="control-label col-sm-2" for="maximum">最大接待量</label>
                                        <div class="col-lg-8">
                                            <div class="input-group">
                                                <input type="text" class="form-control" id="maximum" name="maximum" placeholder="请输入人数">
                                                <span class="input-group-addon">人</span>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <div class="col-md-6 col-md-offset-3"><!-- 添加事件 -->
                                            <button type="button" class="btn btn-default" id="insertAdd">提交</button>
                                            <button type="reset" class="btn btn-default" href="/CrazyLottery_1.0.0v/manage/AddServer">取消</button>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                    <!-- /.row (nested) -->
                </div>
                <!-- /.panel-body -->
            </div>
            <!-- /.panel -->
        </div>
    </div>
    <!-- /#page-wrapper -->

</div>
<!-- /#wrapper -->

<!-- jQuery -->
<script src="${contextPath}/js/jquery.min.js"></script>

<!-- Bootstrap Core JavaScript -->
<script src="${contextPath}/js/bootstrap.min.js"></script>

<!-- Metis Menu Plugin JavaScript -->
<script src="${contextPath}/js/metisMenu.min.js"></script>

<!-- Custom Theme JavaScript -->
<script src="${contextPath}/js/sb-admin-2.min.js"></script>

<!-- Page-Level Demo Scripts - Tables - Use for reference -->
<script>
    $(function () {
        $('[data-toggle="popover"]').popover();

        $("#insertAdd").click(function(){
            var account = $("#account").val();
            if(account === ''){
                return notice('账户不能为空');
            }

            var serverName = $("#serverName").val();
            if(serverName === ''){
                return notice('姓名不能为空');
            }

            var nickName = $("#nickName").val();
            if(nickName === ''){
                return notice('昵称不能为空');
            }

            var phoneNum = $("#phoneNum").val();
            if(phoneNum === ''){
                return notice('手机号不能为空');
            }

            var password = $("#password1").val();
            if(password === ''){
                return notice('初始密码不能为空');
            }

            var rePassword = $("#rePassword").val();
            if(rePassword === ''){
                return notice('确认密码不能为空');
            }

          

            var serverType = $("#serverType").val();
            if(serverType === ''){
                return notice('请选择角色');
            }

            var Maximum = $("#Maximum").val();
            if(Maximum === ''){
                return notice('最大接待量不能为空');
            }
        });

        //提示信息封装函数
        function notice(notice) {
            var str = '';
            str += '<div class="popupTip" style="padding-right:20px">';
            str += notice;
            str += '<span class="iconfont icon-quxiao remove"></span>';
            str += '</div>';
            str += '</strong></div>';
            //wrapper插入str
            $("#wrapper").append(str);
        }

        //取消提示框
        $("#wrapper").on('click', '.remove', function(){
            $(".popupTip") .hide();
        });
        
        $("#insertAdd").click(function(){
    		var account = $("#account1").val();
    		var reg = /^[0-9a-zA-Z]{3,14}$/ ;
    		if(!reg.exec(account)){
    			alert('账号只能输入英文和数字3到14位');
    			  return;
    		}
    		
    		var serverName = $("#serverName").val();
    		if(serverName===''){
    			alert("客服姓名不能为空");
    			return;
    		}
    		  		
    		var nickName = $("#nickName").val();
    		if(nickName===''){
    			alert("客服昵称不能为空");
    			return;
    		}
    		
    		var phoneNum = $("#phoneNum").val();
    		var myreg = /^(((13[0-9]{1})|(15[0-9]{1})|(17[0-9]{1})|(18[0-9]{1}))+\d{8})$/; 
			 if(!myreg.test(phoneNum)){
				 alert('你输入的 手机号不正确');
				 return;
  		 }

    		var password = $("#password1").val(); 
    		var myrg=/^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{10,20}$/;
    		if(!myrg.test(password)){
    			alert('密码只能输入10到20位数字和字母组合');
    			 return;
               
    		}
    		
    		var rePassword = $("#rePassword").val(); 
    		if(rePassword!==password){
    			alert('请输入一致的密码 ');
   			 return;
    		}
    			
    		var serverType =$("#serverType").val(); 
    		
    		var maximum = $("#maximum").val();
    		 var eg=/^\d{1,3}$/;
     		if(!eg.test(maximum)){
     			alert('最大接待量只能输入数字1到3位');
     			return;
     		}
    		
    		
    		$.ajax({
    			type:'post',
				url:'${contextPath}/WebManager/manage/insertAddServer',
				data:"{\"account\":\""+account+"\",\"serverName\":\""+serverName+"\",\"nickName\":\""+nickName+"\",\"phoneNum\":\""+phoneNum+"\",\"password\":\""+password+"\",\"serverType\":\""+serverType+"\",\"maximum\":\""+maximum+"\"}",
				dataType:'json',
				contentType: "application/json;charset=utf-8",
				success:function(data){
					if(data.status != 1){
						window.location.href = '${contextPath}/WebManager/manage/serverList?pageNow=1';
	 				}else if(data.message==='用户已存在'){
	 					notice("用户已存在!");
	 				}else if(data.message==='请输入不超过7个汉字或1-14个英文的姓名'){
	 					notice("请输入不超过7个汉字或1-14个英文的姓名!");
	 				}else if(data.message==='请输入不超过7个汉字或1-14个英文的昵称 '){
	 					notice("请输入不超过7个汉字或1-14个英文的昵称!");
	 				}
	 				else if(data.message==='添加失败'){
	 					notice("添加失败!");
	 				}
					
				},
    		});
    	});
    })
    
</script>

</body>

</html>
